<template v-if="x.type === 'BaseCates'">
	<view v-show="cates.length > 0" class="flex-center" style="" :style="[x._outerStyle]">
		<view class="flex-x" style="" :style="[x._interStyle]">
			<view v-for="xx in cates" :key="xx.id" @click="goto.cate(xx.id)" style="" :style="[x._fontStyle]">
				{{ xx.name }}
			</view>
		</view>
	</view>
</template>

<script lang="ts">

import { defineComponent } from 'vue'
import { TaCache, TaDataGoods } from '@/utils';

export default defineComponent({
	props: {
		x: {
			type: Object,
			required: true
		}
	},
	data() {
		return {
			cates: TaCache.get('mall.goods.cate') || [],
			marks: TaCache.get('mall.goods.make') || [],
		}
	},
	created() {
		this.loadData()
		uni.$off('RefreshPageData', this.loadData)
		uni.$on('RefreshPageData', this.loadData)
	},
	methods: {
		loadData() {
			TaDataGoods.withCate().then((ret: any) => {
				this.cates = ret.data.cate || []
				this.marks = ret.data.mark || []
				TaCache.set('mall.goods.cate', ret.data.cate || [])
				TaCache.set('mall.goods.make', ret.data.mark || [])
			})
		}
	}
})
</script>